//<editor-fold defaultstate="collapsed" desc="VARIABLES GLOBALES">
var grid;
var gridDetalle;
var modGridDetalle;
var datos = [];
var datosDetalle = [];
var modDatosDetalle = [];
//</editor-fold>

//<editor-fold defaultstate="collapsed" desc="INICIALIZACIONES">
function activarDialogos() {
    $("#dlgNuevo").dialog({
        autoOpen: false,
        height: 'auto',
        width: '600',
        modal: true,
        resizable: false,
        show: 'slide',
        hide: 'fade',
        closeOnEscape: false,
        open: function() {
            $('.ui-dialog').addClass('ui-dialog-shadow');
            $('.ui-dialog-titlebar-close', $(this).parent()).hide();
            $('.total').val('0');
        }
    });
    $("#dlgEliminar").dialog({
        autoOpen: false,
        height: 'auto',
        width: '400',
        modal: true,
        resizable: false,
        show: 'slide',
        hide: 'fade',
        closeOnEscape: false,
        open: function() {
            $(".ui-dialog").addClass("ui-dialog-shadow");
            $('.ui-dialog-titlebar-close', $(this).parent()).hide();
        }
    });
    $("#dlgModificar").dialog({
        autoOpen: false,
        height: 'auto',
        width: '600',
        modal: true,
        resizable: false,
        show: 'slide',
        hide: 'fade',
        closeOnEscape: false,
        open: function() {
            $(".ui-dialog").addClass("ui-dialog-shadow");
            $('.ui-dialog-titlebar-close', $(this).parent()).hide();
        }
    });
    $("#dlgBuscar").dialog({
        autoOpen: false,
        height: 'auto',
        width: '550',
        modal: true,
        resizable: false,
        show: 'slide',
        hide: 'fade',
        closeOnEscape: false,
        open: function() {
            $(".ui-dialog").addClass("ui-dialog-shadow");
            $('.ui-dialog-titlebar-close', $(this).parent()).hide();
        }
    });
    $("#dlgNuevoDetallePedido").dialog({
        autoOpen: false,
        height: 'auto',
        width: '450',
        modal: true,
        resizable: false,
        show: 'slide',
        hide: 'fade',
        closeOnEscape: false,
        open: function() {
            $(".ui-dialog").addClass("ui-dialog-shadow");
            $('.ui-dialog-titlebar-close', $(this).parent()).hide();
        }
    });
}

function formatter(row, cell, value, columnDef, dataContext) {
    return "<a href='#' onclick='eliminarPedido(" + row + ")'><image alt='borrar pedido' title='borrar' src='resources/images/delete.png'/></a>" +
            "&nbsp;&nbsp;" +
            "<a href='#' onclick='modificarPedido()'><image alt='modificar pedido' title='modificar' src='resources/images/edit.png'/></a>";
}

function dateFormatter(row, cell, value, columnDef, dataContext) {
    return $.datepicker.formatDate('dd-mm-yy', new Date(value));
}

function formatterDetalle(row, cell, value, columnDef, dataContext) {
    return "<a href='#' onclick='eliminarDetalle(" + dataContext.idDetalle + ")'><image alt='borrar art&iacute;culo' title='borrar' src='resources/images/delete.png'/></a>";
}

function formatterSubtotal(row, cell, value, columnDef, dataContext) {
    if (row === 0) {
        var total = 0;
    } else {
        var total = parseFloat($('.total').val());
    }
    var base = dataContext.cantidad * dataContext.precio;
    var iva = dataContext.iva;
    value = base + (base * iva) / 100;
    $('.total').val((total + value).toFixed(2));
    return value.toFixed(2);
}

function inicializarGrid() {
    var columnas = [
        {name: 'Pedido n&uacute;m.', id: 'id', field: 'id', width: 192, cssClass: 'centro'},
        {name: 'Fecha', id: 'fecha', field: 'fecha', width: 200, cssClass: 'centro', formatter: dateFormatter},
        {name: 'Cliente', id: 'nombreCliente', field: 'nombreCliente', width: 550, cssClass: 'izquierda'},
        {name: 'Estado', id: 'descripcionEstado', field: 'descripcionEstado', width: 300, cssClass: 'izquierda'},
        {name: '', id: 'id', field: 'id', width: 60, formatter: formatter}
    ];
    var opciones = {
        enableCellNavigation: true,
        enableColumnReorder: true,
        rowHeight: 25
    };

    grid = new Slick.Grid("#tabla", datos, columnas, opciones);
    grid.onClick.subscribe(function(e, args) {
        mostrarDatos(args);
    });
    grid.setSelectionModel(new Slick.RowSelectionModel());
}

function inicializarGridDetalle() {
    var columnas = [
        {name: 'C&oacute;d.', id: 'codigo', field: 'codigo', width: 50, cssClass: 'centro'},
        {name: 'Producto', id: 'descripcionProducto', field: 'descripcionProducto', width: 215, cssClass: 'izquierda'},
        {name: 'Cantidad', id: 'cantidad', field: 'cantidad', width: 70, cssClass: 'centro'},
        {name: 'Precio', id: 'precio', field: 'precio', width: 70, cssClass: 'centro'},
        {name: 'IVA %', id: 'iva', field: 'iva', width: 50, cssClass: 'centro'},
        {name: 'Subtotal', id: 'subtotal', width: 80, cssClass: 'centro', total: 'sum', formatter: formatterSubtotal},
        {name: '', id: 'id', field: 'id', width: 32, formatter: formatterDetalle}
    ];
    var opciones = {
        enableCellNavigation: true,
        enableColumnReorder: true,
        rowHeight: 25
    };

    gridDetalle = new Slick.Grid("#tablaDetalle", datosDetalle, columnas, opciones);
    gridDetalle.setSelectionModel(new Slick.RowSelectionModel());

    modGridDetalle = new Slick.Grid("#modTablaDetalle", modDatosDetalle, columnas, opciones);
    modGridDetalle.setSelectionModel(new Slick.RowSelectionModel());
}
//</editor-fold>

//<editor-fold defaultstate="collapsed" desc="GESTIÓN DE DIÁLOGOS">
function buscarPedido() {
    $("#dlgBuscar").dialog('open');
}

function nuevoPedido() {
    $("#dlgNuevo").dialog('open');
}

function modificarPedido() {
    $("#dlgModificar").dialog('open');
}

function eliminarPedido(row) {
    $('#formEliminar').find('#idPedido').html('Pedido n&uacute;m. ' + datos[row].id);
    $('#dlgEliminar').dialog('open');
}

function nuevoDetalle() {
    $('#dlgNuevoDetallePedido').dialog('open');
}

function cerrarDialogo(dialogo) {
    $(dialogo).dialog('close');
    $('.err').html('');
    $('.loading').hide();
    if (dialogo.indexOf('dlgNuevo') > 0 || dialogo.indexOf('dlgModificar') > 0) {
        cancelar();
    }
}
//</editor-fold>

//<editor-fold defaultstate="collapsed" desc="OPERACIONES CRUD PEDIDO">
/*Basicamente, todas las operaciones CRUD consisten en una petición Ajax a un 
 * ActionForm determinado que varía dependiendo de la entidad tratada.
 * La acción a realizar (buscar, grabar, etc) se aporta al vuelo a través
 * de la etiqueta con id 'opcion' de su correspondiente formulario, que a su vez
 * está vinculada con el atributo 'opcion' del ActionForm.
 * 
 * Posteriormente, se trata el error o la información recibidos, mostrando el primero
 * en la etiqueta destinada a recoger los errores y la segunda (data en formato JSON)
 * en el grid de datos apropiado. 
 * 
 * El resto del código se dedica a mostrar/ocultar animaciones de carga y a cerrar 
 * las ventanas de diálogo.
 */
function buscar() {
    $('#formBuscar').find('#opcion').val('buscar');
    var formulario = new FormData($('#formBuscar')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('.err').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            datos = $.parseJSON(data);
            grid.setData(datos);
            grid.invalidate();
            resetearFormularioPrincipal();
            $('.err').html('');
            $('#dlgBuscar').dialog('close');
            $('.loading').hide();
        }
    });
}

function cancelar() {
    $('#formNuevo').find('#opcion').val('cancelar');
    var formulario = new FormData($('#formNuevo')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresNuevo').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            var errores = $('#erroresNuevo', $(data));
            if (errores.text() !== '') {
                $('#erroresNuevo').html(errores);
            } else {
                if (data.indexOf('excepcion') > 0) {
                    $('#erroresNuevo').html(data);
                } else {
                    $('#erroresNuevo').html('');
                    gridDetalle.setData([]);
                    gridDetalle.invalidate();
                    $('#dlgNuevo').dialog('close');
                    $('#formNuevo')[0].reset();
                }
            }
            $('.loading').hide();
        }
    });
}

function grabar() {
    $('#formNuevo').find('#opcion').val('grabar');
    var formulario = new FormData($('#formNuevo')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresNuevo').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            var errores = $('#erroresNuevo', $(data));
            if (errores.text() !== '') {
                $('#erroresNuevo').html(errores);
            } else {
                if (data.indexOf('excepcion') > 0) {
                    $('#erroresNuevo').html(data);
                } else {
                    $('#erroresNuevo').html('');
                    cancelar();
                    buscar();
                    $('#dlgNuevo').dialog('close');
                    $('#formNuevo')[0].reset();
                }
            }
            $('.loading').hide();
        }
    });
}

function eliminar() {
    $('#formEliminar').find('#opcion').val('eliminar');
    var formulario = new FormData($('#formEliminar')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresEliminar').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            var errores = $('#erroresEliminar', $(data));
            if (errores.text() !== '') {
                $('#erroresEliminar').html(errores);
            } else {
                buscar();
                $('#dlgEliminar').dialog('close');
                $('#formEliminar')[0].reset();
                resetearFormularioPrincipal();
            }
            $('.loading').hide();
        }
    });
}

function modificar() {
    $('#formModificarPedido').find('#modOpcion').val('modificar');
    var formulario = new FormData($('#formModificarPedido')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresModificar').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
             if (data.indexOf('<!DOCTYPE') > 0) {
                var errores = $('#erroresModificarPedido', $(data));
                $('#erroresModificarPedido').html(errores);
            } else {
                if (data.indexOf('excepcion') > 0) {
                    $('#erroresModificarPedido').html(data);
                } else {
                    buscar();
                    $('#dlgModificar').dialog('close');
                }
            }
            $('.loading').hide();
        }
    });
}

//</editor-fold>

//<editor-fold defaultstate="collapsed" desc="OPERACIONES CRUD DETALLE-PEDIDO">
/*Basicamente, todas las operaciones CRUD consisten en una petición Ajax a un 
 * ActionForm determinado que varía dependiendo de la entidad tratada.
 * La acción a realizar (buscar, grabar, etc) se aporta al vuelo a través
 * de la etiqueta con id 'opcion' de su correspondiente formulario, que a su vez
 * está vinculada con el atributo 'opcion' del ActionForm.
 * 
 * Posteriormente, se trata el error o la información recibidos, mostrando el primero
 * en la etiqueta destinada a recoger los errores y la segunda (data en formato JSON)
 * en el grid de datos apropiado. 
 * 
 * El resto del código se dedica a mostrar/ocultar animaciones de carga y a cerrar 
 * las ventanas de diálogo.
 */
function buscarDetalle() {
    $('#formModificarPedido').find('#modOpcion').val('buscardetalle');
    var formulario = new FormData($('#formModificarPedido')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresModificarPedido').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            if (data.indexOf('<!DOCTYPE') > 0) {
                var errores = $('#erroresModificarPedido', $(data));
                $('#erroresModificarPedido').html(errores);
            } else {
                if (data.indexOf('excepcion') > 0) {
                    $('#erroresModificarPedido').html(data);
                } else {
                    $('#erroresModificarPedido').html('');
                    modDatosDetalle = $.parseJSON(data);
                    modGridDetalle.setData(modDatosDetalle);
                    modGridDetalle.invalidate();
                }
            }
            $('.loading').hide();
        }
    });
}

function anadirDetalle() {
    $('#formNuevoDetallePedido').find('#opcion').val('anadirdetalle');
    var formulario = new FormData($('#formNuevoDetallePedido')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresNuevoDetalle').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            if (data.indexOf('<!DOCTYPE') > 0) {
                var errores = $('#erroresNuevoDetalle', $(data));
                $('#erroresNuevoDetalle').html(errores);
            } else {
                if (data.indexOf('excepcion') > 0) {
                    $('#erroresNuevoDetalle').html(data);
                } else {
                    $('#erroresNuevoDetalle').html('');
                    // Grid de datos para la inserción
                    datosDetalle = $.parseJSON(data);
                    gridDetalle.setData(datosDetalle);
                    gridDetalle.invalidate();
                    // Grid de datos para la modificación
                    modDatosDetalle = $.parseJSON(data);
                    modGridDetalle.setData(modDatosDetalle);
                    modGridDetalle.invalidate();
                    $('#dlgNuevoDetallePedido').dialog('close');
                    $('#formNuevoDetallePedido')[0].reset();
                }
            }
            $('.loading').hide();
        }
    });
}

function eliminarDetalle(id) {
    $('#formEliminarDetallePedido').find('#idDetalle').val(id);
    var formulario = new FormData($('#formEliminarDetallePedido')[0]);
    $('.loading').show();
    $.ajax({
        type: "POST",
        url: "/Phama/pedidoscliente.do",
        data: formulario,
        processData: false,
        contentType: false,
        error: function(jqXHR, textStatus, errorMessage) {
            $('#erroresNuevo').html(errorMessage);
            $('.loading').hide();
        },
        success: function(data) {
            if (data.indexOf('<!DOCTYPE') > 0) {
                var errores = $('#erroresNuevo', $(data));
                $('#erroresNuevo').html(errores);
            } else {
                if (data.indexOf("[]") === 0) {
                    $('.total').val(0);
                }
                // Grid de datos para la inserción
                datosDetalle = $.parseJSON(data);
                gridDetalle.setData(datosDetalle);
                gridDetalle.invalidate();                
                // Grid de datos para la modificación                
                modDatosDetalle = $.parseJSON(data);
                modGridDetalle.setData(modDatosDetalle);
                modGridDetalle.invalidate();
            }
            $('.loading').hide();
        }
    });
}
//</editor-fold>

//<editor-fold defaultstate="collapsed" desc="FUNCIONES AUXILIARES">
function resetearFormularioPrincipal() {
    $('#erroresModificar').html('');
    $('.modId').val('');
    $('.modFecha').val('');
    $('.modEstado').val('');
    $('.modNotas').val('');
    $('.modCliente').val('');
    resetearFormularioDetalle();
}

function resetearFormularioDetalle() {
    $('.modIdProducto').val('');
    $('.modCantidad').val('');
}

function mostrarDatos(args) {
    var pedido = datos[args.row];
    var fecha = $.datepicker.formatDate('dd-mm-yy', new Date(pedido.fecha));
    $('.modId').val(pedido.id);
    $('.modFecha').val(fecha); // fecha en formato español
    $('.mFecha').val(pedido.fecha); //fecha para selector de fecha
    $('.modEstado').val(pedido.descripcionEstado);
    $('.mEstado').val(pedido.idEstado);
    $('.modNotas').val(pedido.nota);
    $('.modCliente').val(pedido.nombreCliente);
    $('.mCliente').val(pedido.idCliente);
    buscarDetalle();
}

//</editor-fold>